
<%@ page import="auctionatr.Auction"%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="layout" content="main" />
<g:set var="entityName"
	value="${message(code: 'auction.label', default: 'Auction')}" />
<title><g:message code="auction.finish.headline.label"
		args="[entityName]" /></title>
<!--  original: code="default.show.label" -->

<!--  this builds up the google line chart -->
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
      google.load('visualization', '1');   // Don't need to specify chart libraries!
      google.setOnLoadCallback(drawVisualization);

      function drawVisualization() {
    	  var wrapper = new google.visualization.ChartWrapper({
              chartType: 'LineChart',
              dataTable: [['Datum', 'Gebot'],
                          ['<g:formatDate format="${message(code: 'default.date.format', default: 'DateFormat')}" date="${auctionInstance?.dateCreated}"/>', ${auctionInstance?.startPrice}],
                          <g:each in="${bidListAsc}" var="bidInstance">
                          ['<g:formatDate format="${message(code: 'default.date.format', default: 'DateFormat')}" date="${bidInstance?.dateCreated}"/>', ${bidInstance?.gebot}],
                          </g:each>
                          ],
              options: {
                  'title' : '<g:message code="auction.finish.chartHeadline.label" default="Bid Overview"/>',
                  'legend' : 'none', 
                  'pointSize' : '10',
                  'vAxis.gridlineColor' : 'black',
                  'fontName' : 'Helvetica',
                  'curveType' : 'function',
                  'backgroundColor' : 'none'},
              containerId: 'vis_div'
            });
                  
       wrapper.draw();
      }
    </script>
<!-- End of google chart -->

</head>
<body>
	<div class="body">
		<h1>
			<g:message code="auction.finish.headline.label" args="[entityName]" />
			:
			${fieldValue(bean: auctionInstance, field: "name")}
			<!--  original: code="default.show.label" -->
		</h1>
		<g:if test="${flash.message}">
			<div class="message">
				${flash.message}
			</div>
		</g:if>
		<div class="dialog">
			<table>
				<tr>
					<td rowspan="14"><g:if test="${auctionInstance?.picture}">
							<img class="auctionImage" width="200"
								src="${createLink(controller:'auction', action:'auctionImage', id:fieldValue(bean: auctionInstance, field: "id"))}" />
						</g:if></td>
					<td>
						<div id="vis_div" style="width: 600px; height: 400px;"></div>
					</td>
				</tr>
			</table>
			<table>
				<tbody>



					<tr class="prop">
						<td valign="top" class="name"><h3>
								<g:message code="auction.finish.price.label"
									default="Selling price" />
							</h3></td>
						<td valign="top" class="value">
							<h3>
								<g:formatNumber number="${winningBid.gebot}" type="currency"
									currencyCode="EUR" />
							</h3>
						</td>

					</tr>
					<tr class="prop">
						<td valign="top" class="name"><g:message
								code="auction.finishDate.label" default="Finish Date" /></td>

						<td valign="top" class="value"><g:formatDate format="${message(code: 'default.date.format', default: 'DateFormat')}"
								date="${auctionInstance?.finishDate}" /></td>

					</tr>


					<tr class="prop">
						<td valign="top" class="name"><g:message
								code="auction.shipment.label" default="Shipment" /></td>

						<td valign="top" class="value">
							${fieldValue(bean: auctionInstance, field: "shipment")}

						</td>

					</tr>


					<tr class="prop">
						<td valign="top" class="name"><g:message
								code="auction.deliveryCosts.label" default="Delivery Costs" />
						</td>

						<td valign="top" class="value"><g:formatNumber
								number="${auctionInstance.deliveryCosts}" type="currency"
								currencyCode="EUR" /></td>

					</tr>
					<tr class="prop">
						<td class="name"></td>
						<td class="value"></td>
					</tr>
					<tr class="prop">
						<td valign="top" class="name"><h3>
								<g:message code="auction.finish.sendTo.label" default="Send to:" />
							</h3></td>
						<td class="value"><h3>
								${winningUser?.firstName }
								${winningUser?.lastName}
							</h3></td>
					</tr>
					<tr class="prop">
						<td valign="top" class="name"><g:message
								code="auction.finish.street.label" default="Street" />
						<td class="value">
							${winningUser?.street }
						</td>
					</tr>
					<tr class="prop">
						<td valign="top" class="name"><g:message
								code="auction.finish.city.label" default="City" />
						<td class="value">
							${winningUser?.zip} ${winningUser?.city }
						</td>
					</tr>
					<tr class="prop">
						<td valign="top" class="name"><g:message
								code="auction.finish.email.label" default="E-Mail" />
						<td class="value"><a href="mailto:${winningUser?.email}">
								${winningUser?.email}
						</a></td>
					</tr>
					</tr>
					<tr class="prop">
						<td class="name"></td>
						<td class="value"></td>
					</tr>
					<tr class="prop" colspan="2">
						<td valign="top" class="name" style="vertical-align: top;"><h3>
								<g:message code="auction.finish.bidList.label"
									default="Bid Overview" />
							</h3></td>
					</tr>
				<g:each in="${bidList}" var="bidInstance">
					<tr class="prop">
						<td class="name">
							${bidInstance?.users?.username} (<g:formatDate format="${message(code: 'default.date.format', default: 'DateFormat')}"
								date="${bidInstance?.dateCreated}" />)
						</td>

						<td class="value"><g:formatNumber number="${bidInstance.gebot}"
								type="currency" currencyCode="EUR" /></td>
					</tr>
				</g:each>
				</tbody>
			</table>
		</div>

	</div>
</body>
</html>
